<template>
	<p id='p1'></p>
   <input type="button" value="点击打印信息" v-on:click="showmsg" />
   <input type="button" value="点击打印信息1" @click="showmsg1" />
   <p>msg:{{msg}}</p>
   <p>objmsg:{{objmsg}}</p>
</template>

<script setup>
	import {ref} from 'vue'
	//有时需要给DOM元素绑定事件，从而利用事件实现交互效果，
	//这时可以利用事件绑定指令v-on来实现
	//事件名即DOM中的事件名，例如click、input、keyup等；
	//事件处理器可以是方法名或内联JavaScript语句。
	//可以将“v-on:事件名”简写为“@事件名”
	//定义变量
	const msg='千里马';
	const objmsg=ref(msg);
	//定义函数
	const showmsg=()=>{
		console.log('学习v-on事件绑定指令')
	}
	const showmsg1=function(){
		objmsg.value='千里马 v-on'
	}
</script>

<style>
</style>